// 使用嵌套路由(children)实现,上下布局不变(一级路由----layout),中间布局变化(二级路由----router-view)
// 登录不嵌套
import { createRouter, createWebHashHistory } from 'vue-router'

// 公共布局组件
import Layout from '@/views/Layout'
// 子路由
import Home from '@/views/Home'
import Category from '@/views/Category'
import CategorySub from '@/views/Category/sub'
import Goods from '@/views/Goods'
// 路由懒加载
// 懒加载分析：定义为函数，按需执行
const Login = () => import('@/views/Login')
const Test = () => import('@/views/test')

const callBack = () => import('@/views/Login/callback')

const routes = [
  {
    path: '/',
    component: Layout,
    // 二级路由
    children: [
      // 首页
      {
        path: '/',
        component: Home
      },
      // 一级分类页(动态路由)
      {
        path: '/category/:id',
        component: Category
      },
      // 二级分类页(动态路由)
      {
        path: '/category/sub/:id',
        component: CategorySub
      },
      // 商品详情
      {
        path: '/goods/:id',
        component: Goods
      }
    ]

  },

  {
    path: '/login',
    component: Login
  },
  // qq回跳
  {
    path: '/login/callback',
    component: callBack
  },
  //   测试
  {
    path: '/test',
    component: Test
  }

]

// vue3创建路由router实例，使用createRouter()
const router = createRouter({
  history: createWebHashHistory(), // createWebHistory()(history模式)--createWebHashHistory()(hash模式)
  routes
})

export default router
